<template>
    <yh-dialog
        :title="dialogVO.title"
        :visible.sync="dialogVO.visible"
        class="form-dialog"
        :close-on-click-modal="dialogVO.closeOnClickModal"
        :before-close="closeFormDialog"
        :append-to-body="true"
        :show-close="false"
        ref="ruleForm"
    >
        <el-upload
            class="upload-demo"
            ref="upload"
            :on-remove="handleChange"
            :on-change="handleChange"
            :on-preview="handlePreview"
            :multiple="true"
            accept=".xls, .xlsx"
            :file-list="fileList"
            :auto-upload="false"
            :show-file-list="false"
        >
            <el-button slot="trigger" size="small" type="primary" @click="clear" :disabled="uploading">浏览文件</el-button>
        </el-upload>
        <div style="position: absolute; right: 30px; top: 59px">
            <el-button slot="trigger" v-show="failMap" size="small" type="primary" @click="downFail">下载失败明细</el-button>
        </div>
        <span class="tip-class"
            >总个数：{{ uploadList.length }}&emsp;&emsp; 选中个数：{{ selectList.length }} &emsp;&emsp; 成功个数：{{ success }}&emsp;&emsp;
            失败个数：{{ fail }}
        </span>
        <span v-show="uploaded" class="tip-result">解析成功！</span>
        <yh-table
            resizable
            show-overflow
            highlight-hover-row
            highlight-current-row
            class="table-class"
            border="none"
            ref="refTable"
            :data="uploadList"
            @checkbox-change="selectionChange"
            @checkbox-all="selectionChange"
        >
            <yh-table-column type="selection" width="40" fixed="left"></yh-table-column>
            <yh-table-column field="fileName" title="文件名称" align="center" min-width="200"> </yh-table-column>
            <yh-table-column field="status" title="导入状态" align="left" width="100">
                <template slot-scope="scope">
                    <span v-show="scope.row.status == '1'">成功</span>
                    <span v-show="scope.row.status == '0'">失败</span>
                </template>
            </yh-table-column>
            <yh-table-column field="remarks" title="备注" align="left" min-width="100"></yh-table-column>
        </yh-table>
        <span slot="footer" class="dialog-footer">
            <el-button @click="cancle">取消</el-button>
            <el-button type="primary" @click="comfirm_" v-show="uploaded">确定</el-button>
            <el-button type="primary" @click="submitUpload" v-show="!uploaded" :disabled="uploading && selectList.length == 0">导入</el-button>
        </span>
    </yh-dialog>
</template>

<script lang="ts">
import InvestmentUploadController from '../controller/InvestmentUploadController';
export default class InvestmentUpload extends InvestmentUploadController {}
</script>

<style lang="scss" scoped>
.tip-class {
    margin-left: 20px;
    font-weight: 600;
}
.tip-result {
    font-weight: 600;
    color: red;
    float: right;
}
</style>
